﻿<script type="text/javascript">
    $('.chzn-drop').css('left', '0px');
    $('.chzn-drop').css('display', 'none');
    $('.chzn-single').on("click", function (e) {
        $(this).toggleClass('chzn-single-with-drop');
        $(this).next().toggleClass('visible');
        e.preventDefault();
    });
</script>

<style>
    .visible {
        display: block !important;
    }

    .chzn-results li:hover {
        background-color: #df4a43;
        color: white;
    }

    .form-group {
        width: 89%;
        text-align: left;
        margin: 0 auto;
    }

    .btn-fullcolor {
        width: 150px;
    }

    div#search_status_chzn {
            background-color: white;
    }

    .pattern-bg{
        background-image: url("../images/banners/Contact/buy-rent.jpg");
        background-size: cover;
    }
    .pattern-bg.colored-bg:before{
        background-color: rgba(0,0,0,0.6);
    }

    #editor{
        min-height: 420px;
        background-color: white;
        margin-bottom: 42px;
        max-height: 420px;
        overflow: auto;
    }

    body{
        color:black;
    }

    textarea{
        resize: none;
        width: 100%;
        height: 420px;
        margin: 20px 0px;
    }

    .hidden{
        display:none;
    }

    .btn-group{ width:100%; }
    .btn-group .btn{
        display:inline-block;
        width: 25%;
        border-radius:0px;
        border:0;
        margin-bottom:20px;
    }

    
    .btn-group .row div:nth-child(1){
        text-align:end;
    }

    .btn-switch{
        border-radius:0px;
        border:0;
        margin-bottom:20px;
    }

     .btn-group .row{
            text-align:right;
            margin-right: 0px;
        }


    @media only screen and (max-width: 991px){
        .btn-group .row div:nth-child(1){
            text-align: center;
        }
        .btn-group .row{
            text-align:center;
        }

        .btn-group .row button{
            width: 100%;
        }

        .btn-publish{
            margin-top: 10px;
        }
    }

   
</style>



		<!-- BEGIN PAGE TITLE/BREADCRUMB -->
 <div class="parallax colored-bg pattern-bg" data-stellar-background-ratio="0.5">
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
                <h1 class="page-title">Create</h1>

                <!-- <ul class="breadcrumb">
                    <li><a href="index.html">Home </a></li>
                    <li><a href="#">Pages</a></li>
                    <li><a href="register.html">Register</a></li>
                </ul> -->
            </div>
        </div>
    </div>
</div> 
<!-- END PAGE TITLE/BREADCRUMB -->
<!-- BEGIN CONTENT WRAPPER -->
<div class="content" ng-controller="BuyRentController">
    <div class="container">
        <div class="row">

            <!-- BEGIN MAIN CONTENT -->
            <div  class="main col-sm-12">

                <div style="float:none; margin: 0 auto" class="login col-sm-10 col-sm-offset-1">
                    
                    <h1 class="center">Create Blog Content</h1>

                    <div ng-if="isSuccess == true" class="alert alert-success">
                        <button type="button" class="close" ng-click="close()" aria-hidden="true">&times;</button>
                        <span>Your blog had been updated!</span>
                        <div>View now: <a target="_blank" href="{{ new_url }}">{{ new_url }}</a></div>
                    </div>

                    <div ng-show="isWarning == true" class="alert alert-warning">
                        <button type="button" class="close" ng-click="close()" aria-hidden="true">&times;</button>
                        <ul ng-repeat="msg in warning">
                            <li class="glyphicon glyphicon-warning-sign">{{msg.msg}}</li>
                        </ul>
                    </div>



                    <div style="float:none;" class="col-sm-12">
                        <form class="form-style">
                            <!--<select ng-model="property.submissionType" ng-options="p for p in property.submissionType" class="form-control"></select>-->

                            <div class="btn-group">

                                <div class="row">
                                    <button type="submit" class="btn btn-primary btn-lg btn-preview" ng-click="previewBlog()">Preview</button>
                                    <button ng-show="isSuccess == false"type="submit" class="btn btn-success btn-lg btn-publish" ng-click="updateBlog()">Update</button>

                                  
                                </div>

                            </div>

                            <div class="input-group" style="margin-bottom:20px;">
                                <span class="input-group-addon transparent">{{BASE_URL }}/</span>

                                <input ng-change="inputChange()" style="margin-bottom:0px;" ng-model="blg.url" type="text" name="url" placeholder="your-route" class="form-control" disabled/>

                            </div>
                            <input ng-change="inputChange()" ng-model="blg.title" type="text" name="title" placeholder="Your Blog title*" class="form-control" />

                            <input ng-change="inputChange()" ng-model="blg.metatitle" type="text" name="metatitle" placeholder="Your Meta Title*" class="form-control" />
                            <input ng-change="inputChange()" ng-model="blg.metadescription" type="text" name="metadescription" placeholder="Your Meta Description*" class="form-control" />
                            <input ng-change="inputChange()" ng-model="blg.metakeywords" type="text" name="metakeywords" placeholder="Your Meta Keywords*" class="form-control" />


                            <div class="row">
                                <div class="col-md-4">
                                    <button type="submit" class="btn btn-fullcolor btn-switch" ng-click="editorSourceChange(); $event.stopPropagation();">{{ changeEditor }}</button>
                                </div>
                            </div>

                           


                            <!-- Create the editor container -->
                            <textarea ng-change="htmlEditorChange()" ng-class="{'hidden': isHTMLEdit === false}" ng-model="htmltext" id="editorText" type="text"></textarea>
                            <div ng-class="{'hidden': isHTMLEdit === true}" id="editor">
                                
                            </div>

                            <!--<select ng-model="property.useInvest" ng-options="c for c in property.useInvest" class="form-control"></select>-->

                            
                        </form>
                    </div>


                </div>

                <!-- <div class="login-info col-sm-4 col-sm-offset-1">
                    <h1>Why should you create an account?</h1>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse facilisis purus sed justo egestas dapibus. Etiam vel sagittis nisi. Curabitur ac egestas lorem. Sed ut odio iaculis, interdum magna non, mattis dolor. Vestibulum id dignissim elit. Cras ut scelerisque dolor.</p>

                    <h1>Sell you property with us.</h1>
                    <p>Vestibulum rhoncus consequat aliquet. Mauris varius posuere mattis. Duis vitae molestie arcu. Curabitur sollicitudin, velit ut eleifend auctor, nibh orci pharetra risus, a malesuada nisi felis vel turpis. Aliquam fermentum nulla felis, sed molestie libero porttitor in. Vestibulum aliquet eu purus quis pellentesque. Nam eget lacus dolor.</p>
                </div> -->
            </div>
            <!-- END MAIN CONTENT -->

        </div>
    </div>
</div>
<!-- END CONTENT WRAPPER -->